<template>
	<view class="content" v-if="startUpData">
		<view v-if="startUpData.startUp == 1">
			<view class="advertising">
				<image :src="$imgUrls(startUpData.start_img)" mode="aspectFill"></image>
			</view>
			<view class="fiexd_bottom">

				<view v-show="isShow" class="indexBtn" @click="vaulting">
					<text class="h6 white">跳过</text>
					<text>{{cudTime}}</text>
					<text class="h6 white">S</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { mapState, mapMutations } from 'vuex';
	import api from '../../common/index.js'
	import config from '../../common/config.js'
	export default {
		data() {
			return {
				isShow: false,
				cudTime: 5,
				dtime: null,
				shareInfo: null,
				startUpData: '',
				options: '',
			}
		},
		onLoad(options) {
			let that = this;
			if (options.pageType || options.share_v_id) that.options = options;
			if (options.scene) {
				let sceneInfo = decodeURIComponent(options.scene).split('&');
				let sceneType = {};
				sceneInfo.forEach(item => {
					let pram = item.split("=")
					sceneType[pram[0]] = pram[1]
				})
				let opt = {
					artId: '',
					pageType: '',
					share_v_id: '',
				}
				if (sceneType.gid) opt.artId = sceneType.gid;
				if (sceneType.artId) opt.artId = sceneType.artId;
				if (sceneType.p && sceneType.p != 0) opt.pageType = sceneType.p;
				if (sceneType.sid) opt.share_v_id = sceneType.sid;
				that.options = opt;
				console.log(opt, 'opt');
			}


		},
		onShow() {
			let that = this;
			that.startUp();
			// #ifdef MP-WEIXIN
			that.$nextTick(function() {
				api.getWXOpenid(that.bid);
			})
			// #endif
		},
		methods: {
			...mapMutations(['getUser', 'getCashPay', 'getpayState']),
			startUp() {
				let that = this;
				that.$http.post({
					url: '/zzj_singleSaleApi/startUp',
				}).then(res => {
					if (res.errcode != '100') return that.$Toast(res.msg);
					const Result = res.data;
					that.startUpData = Result;
					if (Result.countdown) that.cudTime = Result.countdown
					let infoData = {
						'share': Result.share,
						'logo': Result.logo_img,
						'nameDefinition': Result.nameDefinition,
						'withdrawal_rules': Result.withdrawal_rules,
						'mode': Result.mode,
						'title': Result.title,
						'service_tel': Result.service_tel
					}

					// #ifdef H5
					let Obj = {
						'vid': res.v_id,
						'openid': res.open_id,
					}
					infoData = { ...infoData, ...Obj }
					// #endif
					that.getUser(infoData);
					that.getCashPay(Result.cashPay);
					that.getpayState(Result.payState);
					if (Result.startUp == 1) {
						that.isShow = true;
						that.dtime = setInterval(() => {
							if (that.cudTime > 0) {
								that.cudTime--;
							} else {
								clearInterval(that.dtime);
								that.toPage();
							}
						}, 1000)
					} else {
						that.toPage();
					}
				})
			},


			toPage() {
				let that = this;
				let options = this.options;
				if (options.share_v_id) that.getUser({ 'share_v_id': options.share_v_id })
				if (!options || !options.pageType || Object.keys(options) == 0) return this.$pageHome();
				that.toPageUrl(options);
			},




			toPageUrl(options) {
				let that = this;
				let url;

				if (options.pageType == 2) { // 人物详情
					url = `/pages/Details/Details?id=${options.artId}&fromShare=1`
				} else if (options.pageType == 3) { // 活动详情
					url = `/pages/EventsDetails/EventsDetails?event_id=${options.artId}&fromShare=1`
				} else if (options.pageType == 4) { // 活动列表
					url = `/pages/EventsClass/EventsClass?cate_id=${options.artId}&fromShare=1`
				}

				uni.reLaunch({
					url
				});
			},

			vaulting() {
				let that = this;
				clearInterval(that.dtime);
				that.toPage();

			},
		},

		computed: {
			...mapState(['bid']),
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		overflow: hidden;
		display: flex;
		background: #FFFFFF;
		height: 100vh;

		.advertising {
			width: 100%;
			height: 100%;
			position: absolute;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.fiexd_bottom {
			width: 100%;
			height: 300rpx;
			position: fixed;
			bottom: 0;
			left: 0;
			right: 0;
			// background: #FFFFFF;
			z-index: 5;

			image {
				width: 200rpx;
				height: 200rpx;
				position: absolute;
				left: 50%;
				margin-left: -100rpx;
				top: 50%;
				margin-top: -100rpx;
			}

			.indexBtn {
				padding: 0 20rpx;
				line-height: 50rpx;
				border-radius: 64rpx;
				border: 1rpx solid #999999;
				color: #FFFFFF;
				position: absolute;
				right: 30rpx;
				top: 40%;

				text {
					color: #FFFFFF;
					font-size: 24rpx;
					padding: 0 4rpx;
				}
			}
		}

	}
</style>